/**
 * 全局样式定义
 */
import { StyleSheet, Platform } from 'react-native';
import theme from './theme';

/**
 * 全局通用样式
 */
export const globalStyles = StyleSheet.create({
    // 布局
    container: {
        flex: 1,
        backgroundColor: theme.colors.background.default
    },
    flexRow: {
        flexDirection: 'row'
    },
    flexColumn: {
        flexDirection: 'column'
    },
    flexCenter: {
        justifyContent: 'center',
        alignItems: 'center'
    },
    flexStart: {
        justifyContent: 'flex-start',
        alignItems: 'flex-start'
    },
    flexEnd: {
        justifyContent: 'flex-end',
        alignItems: 'flex-end'
    },
    flexBetween: {
        justifyContent: 'space-between',
    },
    flexAround: {
        justifyContent: 'space-around',
    },
    flexWrap: {
        flexWrap: 'wrap'
    },

    // 间距
    paddingXS: {
        padding: theme.spacing.xs
    },
    paddingSM: {
        padding: theme.spacing.sm
    },
    paddingMD: {
        padding: theme.spacing.md
    },
    paddingLG: {
        padding: theme.spacing.lg
    },
    paddingXL: {
        padding: theme.spacing.xl
    },

    marginXS: {
        margin: theme.spacing.xs
    },
    marginSM: {
        margin: theme.spacing.sm
    },
    marginMD: {
        margin: theme.spacing.md
    },
    marginLG: {
        margin: theme.spacing.lg
    },
    marginXL: {
        margin: theme.spacing.xl
    },

    // 文本
    textPrimary: {
        color: theme.colors.text.primary,
        fontFamily: theme.typography.fontFamily.base
    },
    textSecondary: {
        color: theme.colors.text.secondary,
        fontFamily: theme.typography.fontFamily.base
    },
    textCenter: {
        textAlign: 'center'
    },
    textLeft: {
        textAlign: 'left'
    },
    textRight: {
        textAlign: 'right'
    },

    fontXS: {
        fontSize: theme.typography.fontSize.xs
    },
    fontSM: {
        fontSize: theme.typography.fontSize.sm
    },
    fontMD: {
        fontSize: theme.typography.fontSize.md
    },
    fontLG: {
        fontSize: theme.typography.fontSize.lg
    },
    fontXL: {
        fontSize: theme.typography.fontSize.xl
    },

    fontLight: {
        fontWeight: String(theme.typography.fontWeight.light)
    },
    fontRegular: {
        fontWeight: String(theme.typography.fontWeight.regular)
    },
    fontMedium: {
        fontWeight: String(theme.typography.fontWeight.medium)
    },
    fontBold: {
        fontWeight: String(theme.typography.fontWeight.bold)
    },

    // 边框
    borderRadius: {
        borderRadius: theme.borderRadius.md
    },
    borderRadiusSM: {
        borderRadius: theme.borderRadius.sm
    },
    borderRadiusLG: {
        borderRadius: theme.borderRadius.lg
    },

    border: {
        borderWidth: 1,
        borderColor: theme.colors.divider
    },

    // 阴影
    shadowSM: Platform.select({
        ios: {
            shadowColor: theme.colors.common.black,
            shadowOffset: { width: 0, height: 2 },
            shadowOpacity: 0.1,
            shadowRadius: 4
        },
        android: {
            elevation: 2
        },
        web: {
            boxShadow: theme.shadows.sm
        }
    }),

    shadowMD: Platform.select({
        ios: {
            shadowColor: theme.colors.common.black,
            shadowOffset: { width: 0, height: 4 },
            shadowOpacity: 0.1,
            shadowRadius: 8
        },
        android: {
            elevation: 4
        },
        web: {
            boxShadow: theme.shadows.md
        }
    }),

    shadowLG: Platform.select({
        ios: {
            shadowColor: theme.colors.common.black,
            shadowOffset: { width: 0, height: 8 },
            shadowOpacity: 0.1,
            shadowRadius: 16
        },
        android: {
            elevation: 8
        },
        web: {
            boxShadow: theme.shadows.lg
        }
    }),

    // 卡片
    card: {
        backgroundColor: theme.colors.background.paper,
        borderRadius: theme.borderRadius.md,
        ...Platform.select({
            ios: {
                shadowColor: theme.colors.common.black,
                shadowOffset: { width: 0, height: 4 },
                shadowOpacity: 0.1,
                shadowRadius: 8
            },
            android: {
                elevation: 4
            },
            web: {
                boxShadow: theme.shadows.md
            }
        })
    },

    // 按钮基础样式
    button: {
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
        borderRadius: theme.borderRadius.md,
        padding: theme.spacing.md
    },

    // 输入框基础样式
    input: {
        height: 48,
        borderWidth: 1,
        borderColor: theme.colors.gray[300],
        borderRadius: theme.borderRadius.md,
        padding: theme.spacing.md,
        backgroundColor: theme.colors.background.default,
        color: theme.colors.text.primary,
        fontSize: theme.typography.fontSize.md
    }
});

export default globalStyles; 